<template>
  <el-row>
    <el-col :span="1" :offset="1">
      <el-checkbox v-model="allSelect"></el-checkbox>
    </el-col>
    <el-col :span="6">
      <span>选中{{ selectNum }}条</span>
      <span>/</span>
      <span>共有{{ all }}条</span>
    </el-col>
    <el-col :span="4" :offset="8">
      <el-button type="danger" @click="delSelectAll">删除选中元素</el-button>
    </el-col>
  </el-row>
</template>

<script lang="ts">
import { computed, defineComponent } from "vue";

export default defineComponent({
  props: [
    "all",
    "selectNum",
    "allSelectIsOrNo",
    "allSelectTodoList",
    "selectAllDel",
  ],
  setup(props) {
    const allSelect = computed({
      get() {
        return props.allSelectIsOrNo;
      },
      set(value) {
        console.log(value);
        props.allSelectTodoList(value);
      },
    });
    const delSelectAll = () => {
      console.log(11);
      props.selectAllDel();
    };

    return {
      allSelect,
      delSelectAll,
    };
  },
});
</script>

<style scoped>
</style>